import { Select } from 'antd'
import React, { Component } from 'react'

interface IFilter {
    action?: Function;
    course?: any;
    getValue?: (value: any) => any;
    placeholder?: string;
}

export default class FilterByStatistics extends Component<IFilter, any> {
    constructor(props: IFilter) {
        super(props);
        this.state = {
        }
    }

    componentDidMount() {

    }

    onSelectChange(e: any, info: any) {
        const id = parseInt(info.key);
        this.props.getValue?.(id);
    }

    render() {
        const { course } = this.props;
        return (
            <div style={{ margin: 10, marginLeft: 0 }}>
                <Select
                    placeholder={this.props?.placeholder !== null ? this.props?.placeholder : ""}
                    style={{ width: 300 }}
                    showSearch
                    onChange={this.onSelectChange.bind(this)}>
                    {
                        course?.map((element: any, index: number) => {
                            return <Select.Option key={element.id} value={element.courseName}>
                                {element.courseName}
                            </Select.Option>
                        })
                    }
                </Select>
            </div>
        )
    }
}
